<template>
  <div>
    <el-dialog :title="titleOutOrin" :visible.sync="openOutOrin" width="60%">
      <el-form ref="formOutin" :model="outOrin" label-width="220px">
        <el-form-item v-if="itemShow&&itemShow.name&&assetType === 'consumable'" label="耗材名称">
          {{ itemShow.name }}
        </el-form-item>
        <el-form-item v-if="itemShow&&itemShow.name&&assetType === 'accessorie'" label="附属品名称">
          {{ itemShow.name }}
        </el-form-item>
        <el-form-item v-if="itemShow&&itemShow.name&&assetType === 'license'" label="许可证名称">
          {{ itemShow.name }}
        </el-form-item>
        <el-form-item v-if="itemShow&&itemShow.serial&&assetType === 'license'" label="许可证序列号">
          {{ itemShow.serial }}
        </el-form-item>
        <el-form-item v-if="itemShow&&itemShow.name&&assetType === 'accessorie'" label="附属品类别">
          {{ itemShow.category_name }}
        </el-form-item>
        <el-form-item v-if="itemShow&&itemShow.model_name" label="型号">
          {{ itemShow.model_name }}
        </el-form-item>
        <el-form-item v-if="itemShow&&itemShow.supplier_name&&assetType === 'asset'" label="资产名称">
          {{ itemShow.supplier_name }}
        </el-form-item>
        <el-form-item v-if="itemShow&&itemShow.status&&assetType === 'asset'" label="状态">
          {{ itemShow.status }}
        </el-form-item>
        <el-form-item v-if="assetType === 'asset'||assetType === 'license'" label="借至">
          <el-radio-group v-model="toType" @change="handleRadioChange">
            <el-radio-button label="用户"></el-radio-button>
            <el-radio-button label="资产"></el-radio-button>
            <el-radio-button v-if="assetType === 'asset'" label="位置"></el-radio-button>
          </el-radio-group>
        </el-form-item>
        <el-form-item v-if="(toType === '用户'&&assetType === 'license')||(toType === '用户'&&assetType === 'asset')||assetType === 'consumable' || assetType === 'accessorie' || assetType === 'kits'" label="选择用户" prop="assigned_to_id">
          <el-select v-model="outOrin.assigned_to_id" placeholder="请选择用户" clearable size="small">
            <el-option
              v-for="dict in roleList"
              :key="dict.id"
              :label="dict.name"
              :value="dict.id"
            />
          </el-select>
        </el-form-item>
        <el-form-item v-if="(toType === '资产'&&assetType === 'license')||(toType === '资产'&&assetType === 'asset')" label="选择资产" prop="assigned_to_id">
          <el-select v-model="outOrin.assigned_to_id" placeholder="请选择资产" clearable size="small">
            <el-option
              v-for="dict in assetList"
              :key="dict.id"
              :label="dict.name"
              :value="dict.id"
            />
          </el-select>
        </el-form-item>
        <el-form-item v-if="assetType === 'component'" label="选择资产" prop="assigned_to_id">
          <el-select v-model="outOrin.assigned_to_id" placeholder="请选择资产" clearable size="small">
            <el-option
              v-for="dict in assetList"
              :key="dict.id"
              :label="dict.name"
              :value="dict.id"
            />
          </el-select>
        </el-form-item>
        <el-form-item v-if="toType === '位置'&&assetType === 'asset'" label="选择位置" prop="assigned_to_id">
          <ChooseLocation @commitLocationMethod="commitLocationMethod"></ChooseLocation>
        </el-form-item>
        <el-form-item v-if="assetType === 'asset'||assetType === 'kits'" label="借出日期" prop="checkout_date">
          <el-date-picker
            v-model="outOrin.checkout_date"
            clearable
            size="small"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="选择借出日期"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item v-if="assetType === 'asset'||assetType === 'kits'" label="预计归还日期" prop="expected_checkin_date">
          <el-date-picker
            v-model="outOrin.expected_checkin_date"
            clearable
            size="small"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="选择预计归还日期"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item v-if="assetType === 'component'" label="借出数量" prop="checkout_notes">
          <el-input v-model="outOrin.qty" type="number" placeholder="请输入借出数量" />
        </el-form-item>
        <el-form-item label="借出备注" prop="checkout_notes">
          <el-input v-model="outOrin.checkout_notes" type="textarea" placeholder="请输入内容" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitFormOutIn">确 定</el-button>
        <el-button @click="openOutOrin = false">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { listUser } from "@/api/vadmin/permission/user";
import { listAsset } from "@/api/vadmin/assets/assets";
import { CheckoutProd } from "@/api/vadmin/basic/base";
import { listLocations } from "@/api/vadmin/basic/locations/locations";
import ChooseLocation from "@/views/components/ChooseLocation";
import { kitsCheckout } from "@/api/vadmin/assets/kits";

export default {
  name: "BorrowToo",
  components: { ChooseLocation },
  props: {
    assetType: {
      type: String,
      defalut: ""
    },
    borrowShow: {
      type: Object,
      defalut: {}
    }
  },
  data: function() {
    return {
      titleOutOrin: "借出",
      toType: "用户",
      openOutOrin: false,
      outOrin: {
        assigned_to_id: null,
        checkout_date: null,
        expected_checkin_date: null,
        checkout_notes: null,
        qty: 0
      },
      roleList: [],
      itemShow: null,
      assetList: [],
      assetStatus: [],
      locationList: [],
      rulesOutIn: {
        assigned_to: [
          { required: true, message: "请先选中资产", trigger: "change" }
        ],
        checkout_qty: [
          { required: true, message: "数量不能为空", trigger: "blur" },
          { min: 1, message: "最小借出数量不能小于", trigger: "blur" }
        ]
      }
    };
  },
  computed: {},
  watch: {
    borrowShow: {
      handler(item) {
        this.itemShow = item;
        this.getDicts("asset_status").then(response => {
          this.assetStatus = response.data;
          if (this.itemShow) {
            this.itemShow.status = this.selectDictLabel(this.assetStatus, this.itemShow.status);
          }
        });
        listUser().then(response => {
          this.roleList = response.data.results;
        });
        listAsset({ deleted: false }).then(response => {
          this.assetList = response.data.results;
        });
        listLocations().then(response => {
          this.locationList = response.data.results;
        });
      }
    }
  },
  created() {
  },
  activated() {
  },
  mounted() {
  },
  methods: {
    handleRadioChange(val) {
      this.outOrin.assigned_to_id = "";
    },
    commitLocationMethod(val) {
      this.outOrin.assigned_to_id = val;
    },
    open() {
      this.openOutOrin = true;
    },
    close() {
      this.$refs["formOutin"].resetForm();
      this.openOutOrin = false;
    },
    submitFormOutIn() {
      // this.$emit("commitData", this.outOrin);
      let rq = null;
      switch (this.assetType) {
          // 资产借出
          case "asset":
            let assignedType = "";
            if (this.toType === "用户") {
              assignedType = "user";
            } else if (this.toType === "资产") {
              assignedType = "asset";
            } else {
              assignedType = "location";
            }
            rq = {
              asset_type: this.assetType,
              checkout_id: this.itemShow.id,
              assigned_to_id: this.outOrin.assigned_to_id,
              assigned_type: assignedType,
              check_datetime: this.outOrin.checkout_date + " 00:00:00",
              expected_checkin_date: this.outOrin.expected_checkin_date,
              notes: this.outOrin.checkout_notes
            };
            break;
            // 组件借出
          case "component":
            if ((this.itemShow.qty - this.itemShow.checkout_qty) < this.outOrin.qty) {
              this.$message({
                message: "库存不足最多能借：" + (this.itemShow.qty - this.itemShow.checkout_qty),
                type: "error"
              });
              return;
            } else if (this.outOrin.qty < this.itemShow.min_amt) {
              this.$message({
                message: "借出的数量不得小于最小借出数量：" + this.itemShow.min_amt,
                type: "error"
              });
              return;
            }
            rq = {
              asset_type: this.assetType,
              checkout_id: this.itemShow.id,
              assigned_to_id: this.outOrin.assigned_to_id,
              assigned_type: "asset",
              qty: this.outOrin.qty,
              notes: this.outOrin.checkout_notes
            };
            break;
            // 消耗品借出
          case "consumable":
            rq = {
              asset_type: this.assetType,
              checkout_id: this.itemShow.id,
              assigned_to_id: this.outOrin.assigned_to_id,
              assigned_type: "user",
              notes: this.outOrin.checkout_notes
            };
            break;
            // 附属品
          case "accessorie":
            rq = {
              asset_type: "accessory",
              checkout_id: this.itemShow.id,
              assigned_to_id: this.outOrin.assigned_to_id,
              assigned_type: "user",
              notes: this.outOrin.checkout_notes
            };
            break;
            // 许可证借出
          case "license":
            let assignedType1 = "";
            if (this.toType === "用户") {
              assignedType1 = "user";
            } else if (this.toType === "资产") {
              assignedType1 = "asset";
            }
            rq = {
              asset_type: this.assetType,
              checkout_id: this.itemShow.id,
              assigned_type: assignedType1,
              assigned_to_id: this.outOrin.assigned_to_id,
              notes: this.outOrin.checkout_notes
            };
            break;
            // 自定义工具包
          case "kits":
            rq = {
              asset_type: "asset", kit_id: this.itemShow.id, assigned_to_id: this.outOrin.assigned_to_id, assigned_type: "user",
              notes: this.outOrin.checkout_notes, check_datetime: this.outOrin.checkout_date + " 00:00:00", expected_checkin_date: this.outOrin.expected_checkin_date
            };
            kitsCheckout(rq).then(res => {
              this.$emit("commitData");
            });
            return;
      }
      CheckoutProd(rq).then(res => {
        this.$emit("commitData");
      });
    }
  }
};
</script>

<style scoped>

</style>
